<template>
	<view class="page">
		<view class="flex benben-position-layout flex flex-wrap align-center personalInformation_flex_0"
			:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
			<view class='flex flex-wrap align-center justify-between flex-sub personalInformation_fd0_0'>
				<view class='flex flex-wrap align-center' @tap.stop="handleJumpDiy" data-type="back" data-url="1">
					<text class='fu-iconfont2  personalInformation_fd0_0_c0_c0' @tap.stop="handleJumpDiy"
						data-type="back" data-url="1">&#xE794;</text>
				</view>
				<text class='personalInformation_fd0_0_c1'>价格设置</text>
				<view class='flex flex-wrap align-center personalInformation_fd0_0_c2'>
				</view>
			</view>

		</view>
		<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
		<!-- <view class="search_view">
			<view class="tabs flex align-center justify-between">
				<view class="tabs_item" :class="tabs_id == 1 ? 'active_item' : ''" @tap.stop="selectTabs(1)">
					<view>车型价格</view>
					<view v-if="tabs_id == 1" class="tabs_icon"></view>
				</view>
				<view class="tabs_item" :class="tabs_id == 2 ? 'active_item' : ''" @tap.stop="selectTabs(2)">
					<view>门店价格</view>
					<view v-if="tabs_id == 2" class="tabs_icon"></view>
				</view>
				<view class="tabs_item" :class="tabs_id == 3 ? 'active_item' : ''" @tap.stop="selectTabs(3)">
					<view>节假日价格</view>
					<view v-if="tabs_id == 3" class="tabs_icon"></view>
				</view>
			</view>
		</view> -->
		<view class="loading_css" v-if="isShow">
			<u-loading size="36" color="#1A66FA"></u-loading>
			<view>加载中</view>
		</view>
		<view class="car_list" v-else>
			<view class="car_item" v-for="(item, index) in list" :key="index">
				<view class="car_top flex align-center">
					<view class="top_le">
						<view class="card_no">
							<view class="card_no_text flex align-center">
								<text>{{item.name}}</text>
							</view>
						</view>
						<view class="label_list">
							<view class="label_item flex align-center justify-center">{{item.brand_name}}</view>
						</view>
					</view>
					<view class="top_ri">
						<u-lazy-load height="146" border-radius="16" class="car_img" :image="item.image"
							:loading-img="loadingImg" :error-img="errorImg"></u-lazy-load>
					</view>
				</view>
				<view class="car_btm flex align-center justify-between">
					
					<view class="btm_le flex align-center">
						<view class="btm_le_item flex align-center">
							<view class="btm_le_item_week flex align-center justify-center">价格</view>
							<view class="btm_le_item_price">
								<text class="btm_le_item_price_1">￥</text>
								<text>{{Number(item.price)}}</text>
							</view>
						</view>
						<!-- <view class="btm_le_item flex align-center" style="margin-left: 16rpx;">
							<view class="btm_le_item_week_ot flex align-center justify-center">周末</view>
							<view class="btm_le_item_price_ot">
								<text class="btm_le_item_price_1">￥</text>
								<text>400</text>
							</view>
						</view> -->
					</view>
					<view class="operation_3">{{item.store_name}}</view>
				</view>
				<view class="operation_view flex align-center justify-between">
					<view class="operation_2">库存{{item.think_count}}辆</view>
					<view class="operation_1 flex align-center justify-center" @tap.stop="handleJumpDiy" data-type="navigateTo" :data-url="`/pages/index/priceSet/modelPrice?carInfo=${JSON.stringify(item)}`">价格设置</view>
				</view>
			</view>
			<view class="loadmore" v-if="last_page > 1">
				<u-loadmore font-size="24" :status="status" :icon-type="iconType" :load-text="loadText" />
			</view>
		</view>
		<view class="noData" v-if="list.length == 0 && !isShow">
			<image :src='STATIC_URL+"no.png"'></image>
		</view>
		
		<template v-if="tabs_id == 2">
			<view class="content_bg pad24">
				<view class="item_title">基本费用</view>
				<view class="item_info flex align-center justify-between">
					<view class="item_info_le">基本保障服务费</view>
					<view class="item_info_ri flex align-center">
						<text>
							<text class="item_info_ri_1">￥</text>
							<text class="item_info_ri_2">420</text>
						</text>
						<image class="item_info_ri_icon" :src='STATIC_URL+"208.png"' mode="aspectFill"></image>
					</view>
				</view>
				<view class="item_info flex align-center justify-between">
					<view class="item_info_le">超时费</view>
					<view class="item_info_ri flex align-center">
						<text>
							<text class="item_info_ri_1">￥</text>
							<text class="item_info_ri_2">420</text>
						</text>
						<image class="item_info_ri_icon" :src='STATIC_URL+"208.png"' mode="aspectFill"></image>
					</view>
				</view>
				<view class="item_info flex align-center justify-between">
					<view class="item_info_le">租车押金</view>
					<view class="item_info_ri flex align-center">
						<text>
							<text class="item_info_ri_1">￥</text>
							<text class="item_info_ri_2">420</text>
						</text>
						<image class="item_info_ri_icon" :src='STATIC_URL+"208.png"' mode="aspectFill"></image>
					</view>
				</view>
			</view>
			<view class="content_bg pad24">
				<view class="item_title">夜间服务费</view>
				<view class="item_info flex align-center justify-between">
					<view class="item_info_le">夜间服务费</view>
					<view class="item_info_ri">
						<u-switch v-model="checked" active-color="#1A66FA" size="28"></u-switch>
					</view>
				</view>
				<view class="item_date flex align-center justify-between">
					<view class="item_date_le flex align-center">
						<view class="date_le_text">
							<text>20:30</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
						<view class="date_le_line">—</view>
						<view class="date_le_text">
							<text>20:30</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
					</view>
					<view class="item_date_ri">
						<text>￥</text>
						<text>50</text>
						<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
					</view>
				</view>
			</view>
			
			<view class="content_bg pad24">
				<view class="item_title">上门取送</view>
				<view class="introduce flex align-center">
					<view class="introduce_item flex align-center" v-for="(v, k) in list" :key="k">
						<image :src='STATIC_URL+"7.png"' mode=""></image>
						<text>{{v.name}}</text>
					</view>
				</view>
				<view class="item_info flex align-center justify-between">
					<view class="item_info_le">上门送取车服务</view>
					<view class="item_info_ri">
						<u-switch v-model="checked" active-color="#1A66FA" size="28"></u-switch>
					</view>
				</view>
				<view class="item_date flex align-center justify-between">
					<view class="item_date_le flex align-center">
						<view class="date_le_text">
							<text>20:30</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
						<view class="date_le_line">—</view>
						<view class="date_le_text">
							<text>20:30</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
					</view>
					<view class="item_date_mian flex align-center justify-center">免费</view>
				</view>
				
				<view class="condition">
					<view class="condition_title flex align-center justify-between">
						<view class="condition_title_le flex align-center">
							<image :src='STATIC_URL+"484.png"' mode="aspectFill"></image>
							<text>收费条件</text>
						</view>
						<view class="condition_title_ri">
							<u-switch v-model="checked" active-color="#1A66FA" size="28"></u-switch>
						</view>
					</view>
					<view class="condition_item flex align-center justify-between">
						<view class="condition_item_le">订单总金额低于</view>
						<view class="condition_item_ri">
							<text>￥50</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
					</view>
					<view class="condition_item flex align-center justify-between">
						<view class="condition_item_le">送取车费(单程)</view>
						<view class="condition_item_ri">
							<text>￥50</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
					</view>
				</view>
				
				<view class="item_date flex align-center justify-between">
					<view class="item_date_le flex align-center">
						<view class="date_le_text">
							<text>20:30</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
						<view class="date_le_line">—</view>
						<view class="date_le_text">
							<text>20:30</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
					</view>
					<view class="item_date_ri">
						<text>￥</text>
						<text>50</text>
						<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
					</view>
				</view>
				<view class="tip_text flex align-center">
					<image :src='STATIC_URL+"484.png"' mode="aspectFill"></image>
					<text>最大允许0KM范围内上门取车</text>
				</view>
				
				<view class="condition">
					<view class="condition_title flex align-center justify-between">
						<view class="condition_title_le flex align-center">
							<image :src='STATIC_URL+"484.png"' mode="aspectFill"></image>
							<text>免费条件</text>
						</view>
						<view class="condition_title_ri">
							<u-switch v-model="checked" active-color="#1A66FA" size="28"></u-switch>
						</view>
					</view>
					<view class="condition_item flex align-center justify-between">
						<view class="condition_item_le">订单总金额高于</view>
						<view class="condition_item_ri">
							<text>￥50</text>
							<image :src='STATIC_URL+"483.png"' mode="aspectFill"></image>
						</view>
					</view>
					
				</view>
				<view class="prompt_text">自定义模式请在后台web端管理后台设置</view>
			</view>
			<view class="content_bg pad24">
				<view class="range_info flex align-center justify-between">
					<text>查看送车范围</text>
					<image :src='STATIC_URL+"208.png"' mode="aspectFill"></image>
				</view>
			</view>
			<view class="save_button">
				<view class="save_text">保存</view>
			</view>
			<view style="height: 140rpx;"></view>
		</template>
		
		<template v-if="tabs_id == 3">
			<view class="car_price_list">
				<view class="car_price_item">
					<view class="car_price_top flex align-center">
						<view class="top_price_le">
							<view class="card_price_no">
								<view class="card_price_no_text flex align-center">
									<text>端午节</text>
								</view>
							</view>
						</view>
						<view class="top_price_ri">
							<u-lazy-load height="106" border-radius="16" class="car_price_img" :image="imageUrl"
								:loading-img="loadingImg" :error-img="errorImg"></u-lazy-load>
						</view>
					</view>
					<view class="car_price_date flex align-center justify-between">
						<view class="date_item">
							<view class="date_item_1">13:00 周五</view>
							<view class="date_item_2">05月10日</view>
						</view>
						<view class="date_ce">
							<image class="date_ce_1" :src='STATIC_URL+"467.png"' mode=""></image>
							<view class="date_ce_2">3天</view>
						</view>
						<view class="date_item" style="text-align: right;">
							<view class="date_item_1">13:00 周六</view>
							<view class="date_item_2">05月11日</view>
						</view>
					</view>
					<view class="car_price_btm flex align-center justify-between">
						<view class="btm_price_le flex align-center">
							<view class="p_btm_le_item flex align-center">
								<view class="p_btm_le_item_week flex align-center justify-center">起租</view>
								<view class="p_btm_le_item_price">
									<text class="p_btm_le_item_price_1">￥</text>
									<text>0天起</text>
								</view>
							</view>
							<view class="p_btm_le_item flex align-center" style="margin-left: 16rpx;">
								<view class="p_btm_le_item_week_ot flex align-center justify-center">节假日价格浮动</view>
								<view class="p_btm_le_item_price_ot">
									<text>0%</text>
								</view>
							</view>
						</view>
					</view>
					<view class="operation_view flex align-center justify-end">
						<view class="operation_1 flex align-center justify-center" style="margin-right: 24rpx;" @tap.stop="leaseShow=true">设置起租</view>
						<view class="operation_1 flex align-center justify-center" @tap.stop="priceShow=true">价格设置</view>
					</view>
				</view>
			</view>
		</template>
		
		
		<u-popup v-model="leaseShow" mode="center" border-radius="32">
			<view class="deductible_popup">
				<view class="pop_title">起租设置</view>
				<view class="input_view flex align-center" style="margin-top: 14rpx;">
					<input style="padding: 0 16rpx;" class="input" type="number" placeholder="请输入起租天数" placeholder-style="font-size:32rpx;color:#999;">
				</view>
				<view class="operation flex align-center justify-between" style="margin: 94rpx 0 54rpx;">
					<view class="operation_1 flex align-center justify-center">取消</view>
					<view class="operation_2 flex align-center justify-center">确定</view>
				</view>
				<view class="pop_bg"></view>
			</view>
		</u-popup>
		
		
		<u-popup v-model="priceShow" mode="bottom" border-radius="28">
			<view class="screen_popup">
				<view class="screen_title flex align-center justify-between">
					<view class="">价格浮动</view>
					<u-icon name="close" color="#cccccc" size="30" @click="priceShow=false"></u-icon>
				</view>
				
				<view class="second_title">浮动方式</view>
				<view class="screen_list">
					<view class="screen_item flex align-center justify-center active_item">百分比</view>
				</view>
				
				<view class="second_title">浮动类型</view>
				<view class="float_type">
					<view class="float_item flex align-center justify-center active_item">上浮</view>
					<view class="float_item flex align-center justify-center">下浮</view>
				</view>
				<view class="second_title">浮动比例</view>
				<view class="input_price flex align-center">
					<text class="money_icon">%</text>
					<input class="input" type="number" placeholder="请输入百分比" placeholder-style="font-size:32rpx;color:#999;">
				</view>
				<view class="tip_text flex align-center" style="padding: 26rpx 30rpx;">
					<image :src='STATIC_URL+"484.png"' mode="aspectFill"></image>
					<text>浮动后价格=周末价x（1±浮动比例）</text>
				</view>
				<view class="picker_btn flex align-center justify-between">
					<view class="picker_btn_1 flex align-center justify-center">取消</view>
					<view class="picker_btn_2 flex align-center justify-center">确认</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>
<script>
	import UploadImage from '@/common/utils/upload-image.js'
	import {
		validate
	} from '@/common/utils/validate.js'
	export default {
		components: {},

		data() {
			return {
				"loadingImg": "",
				"errorImg": "",
				"imageUrl": "https://speed.zhongchuxing.com/gjdimages/476.png",
				"tabs_id": 1,
				"checked": false,
				"list": [{
					name: '半径送车模式',
					id: 1
				}, {
					name: '自定义模式',
					id: 2
				}],
				"leaseShow": false,
				"priceShow": false,
				
				"list": [],
				"page": 1,
				"is_pull": true,
				"last_page": 1,
				"status": 'loadmore',
				"iconType": 'flower',
				"loadText": {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '我也是有底线的'
				},
				"isShow": true,
			};
		},
		computed: {
			
		},
		watch: {},
		onLoad(options) {
	
		},
		onUnload() {

		},
		onReady() {

		},
		onShow() {
			this.page = 1;
			this.is_pull = true;
			this.isShow = true;
			this.getCarList();
		},
		onHide() {

		},
		onResize() {

		},
		// 下拉刷新
		onPullDownRefresh() {
			this.page = 1;
			this.is_pull = true;
			this.isShow = true;
			this.getCarList();
		},
		// 上拉加载
		onReachBottom() {
			if (this.page >= this.last_page) return;
			this.status = 'loading';
			this.page++;
			setTimeout(() => {
		
				if (this.page >= this.last_page) this.status = 'nomore';
				else this.status = 'loading';
				this.is_pull = false;
				this.getCarList();
			}, 500)
		},
		onPageScroll(e) {

		},
		methods: {
			selectTabs(id) {
				this.tabs_id = id;
			},
			// 获取车辆列表  storeCar
			getCarList() {
				this.$api.post(global.apiUrls.storeCar, {
					store_id: global.userInfo.store_id,
					page: this.page,
					rows: 10
				}).then(res => {
					console.log(res);
					uni.stopPullDownRefresh();
					this.isShow = false;
					if (res.data.code == 1) {
						this.last_page = res.data.data.totalPage;
						if (this.is_pull) {
							this.list = res.data.data.items;
						} else {
							this.list = this.list.concat(res.data.data.items);
						}
					} else {
						this.$message.info(res.data.info);
					}
				})
			},
		}
	};
</script>
<style lang="scss" scoped>
	.add_car {
		width: 112rpx;
		height: 112rpx;
		position: fixed;
		right: 24rpx;
		bottom: 116rpx;
	}
	.car_list {
		padding: 0 24rpx 24rpx;
		.car_item {
			margin-top: 20rpx;
			background: #fff;
			border-radius: 16rpx;
			padding-bottom: 32rpx;
			.car_top {
				padding-left: 24rpx;
				.top_le {
					width: calc(100% - 222rpx);
					.card_no {
						.card_no_text {
							font-weight: bold;
							font-size: 36rpx;
							color: #222222;
						}
						.car_tag_1 {
							width: 72rpx;
							height: 40rpx;
							background: url(https://speed.zhongchuxing.com/gjdimages/477.png) no-repeat;
							background-size: 100% 100%;
							font-weight: 400;
							font-size: 22rpx;
							color: #FFFFFF;
							margin-left: 10rpx;
						}
						.car_tag_2 {
							width: 72rpx;
							height: 40rpx;
							background: url(https://speed.zhongchuxing.com/gjdimages/478.png) no-repeat;
							background-size: 100% 100%;
							font-weight: 400;
							font-size: 22rpx;
							color: #FFFFFF;
							margin-left: 10rpx;
						}
					}
					.label_list {
						margin-top: 20rpx;
						overflow: hidden;
						.label_item {
							float: left;
							background: #E9EEFF;
							padding: 4rpx 20rpx;
							margin: 0 12rpx 0rpx 0;
							border-radius: 8rpx;
							font-weight: 400;
							font-size: 22rpx;
							color: #1A66FA;
						}
					}
				}
				.top_ri {
					width: 222rpx;
					height: 146rpx;
					.car_img {
						width: 222rpx;
						height: 146rpx;
					}
				}
				/deep/.u-lazy-item {
					width: 222rpx !important;
					height: 146rpx !important;
				}
			}
			.car_ce {
				margin: 8rpx 24rpx 0;
				background: #F6F7FB;
				border-radius: 16rpx;
				padding: 20rpx 24rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
			}
			.car_btm {
				margin: 14rpx 24rpx 0;
				.btm_le {
					.btm_le_item {
						border-radius: 16rpx;
						border: 2rpx solid #DFE9FF;
						.btm_le_item_week {
							font-weight: 500;
							font-size: 24rpx;
							color: #1A66FA;
							width: 90rpx;
							height: 56rpx;
							background: #DFE9FF;
							border-radius: 16rpx 0 30rpx 16rpx;
						}
						.btm_le_item_price {
							color: #1A66FA;
							font-weight: bold;
							font-size: 30rpx;
							padding: 0 14rpx;
							
						}
						.btm_le_item_week_ot {
							font-weight: 500;
							font-size: 24rpx;
							color: #FF532E;
							width: 90rpx;
							height: 56rpx;
							background: #FFEBE7;
							border-radius: 16rpx 0 30rpx 16rpx;
						}
						.btm_le_item_price_ot {
							color: #FF532E;
							font-weight: bold;
							font-size: 30rpx;
							padding: 0 14rpx;
						}
						.btm_le_item_price_1 {
							font-size: 24rpx;
						}
					}
				}
				.btm_ri {
					color: #222222;
					.btm_ri_1 {
						font-size: 24rpx;
					}
					.btm_ri_2 {
						font-size: 24rpx;
						font-weight: bold;
					}
					.btm_ri_3 {
						font-size: 30rpx;
						font-weight: bold;
					}
					.btm_ri_4 {
						font-size: 24rpx;
						font-weight: bold;
					}
				}
			}
			.operation_view {
				margin: 26rpx 24rpx 0;
				.operation_1 {
					width: 208rpx;
					height: 80rpx;
					border-radius: 16rpx;
					border: 2rpx solid #EEEEEE;
					font-weight: 400;
					font-size: 28rpx;
					color: #222222;
					image {
						width: 32rpx;
						height: 32rpx;
						margin-right: 10rpx;
					}
				}
				.operation_2 {
					font-weight: bold;
					font-size: 30rpx;
					color: #222222;
				}
			}
			.operation_3 {
				font-weight: bold;
				font-size: 30rpx;
				color: #222222;
			}
		}
	}
	.search_view {
		padding: 16rpx 24rpx 30rpx;
		.tabs {
			.tabs_item {
				font-weight: 400;
				font-size: 30rpx;
				color: #333333;
				position: relative;
			}
			.active_item {
				font-weight: bold;
				font-size: 38rpx;
				color: #222222;
			}
			.tabs_icon {
				width: 40rpx;
				height: 4rpx;
				background: #1A66FA;
				border-radius: 2rpx;
				position: absolute;
				bottom: -8rpx;
				left: 50%;
				transform: translateX(-50%);
			}
		}
		.search_input {
			width: 100%;
			height: 80rpx;
			border: 2rpx solid #EEEEEE;
			border-radius: 16rpx;
			position: relative;
			padding: 0 24rpx 0 78rpx;
			image {
				position: absolute;
				left: 28rpx;
				top: 50%;
				transform: translateY(-50%);
				width: 25rpx;
				height: 25rpx;
			}
			.input {
				font-size: 30rpx;
			}
		}
	}
	
	.content_bg {
		background: #fff;
		border-radius: 16rpx;
		margin: 24rpx 24rpx 0;
	}
	.item_title {
		font-weight: bold;
		font-size: 30rpx;
		color: rgba(0,0,0,0.8);
		padding: 28rpx 0;
	}
	.item_info {
		padding: 28rpx 0;
		border-top: 1px solid #eee;
		.item_info_le {
			font-weight: 400;
			font-size: 28rpx;
			color: #222222;
		}
		.item_info_ri {
			font-weight: 500;
			color: #222222;
			.item_info_ri_1 {
				font-size: 24rpx;
			}
			.item_info_ri_2 {
				font-size: 30rpx;
			}
			.item_info_ri_3 {
				font-weight: 500;
				font-size: 30rpx;
				color: #999999;
			}
			.item_info_ri_icon {
				width: 28rpx;
				height: 28rpx;
				margin-left: 12rpx;
			}
		}
	}
	.item_date {
		padding: 28rpx 0;
		border-top: 1px solid #eee;
		.item_date_le {
			.date_le_text {
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				image {
					width: 20rpx;
					height: 20rpx;
					margin-left: 8rpx;
				}
			}
			.date_le_line {
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				margin: 0 34rpx;
			}
		}
		.item_date_ri {
			font-weight: 500;
			font-size: 28rpx;
			color: #1A66FA;
			image {
				width: 20rpx;
				height: 20rpx;
				margin-left: 8rpx;
			}
		}
		.item_date_mian {
			width: 72rpx;
			height: 40rpx;
			background: #00C777;
			border-radius: 8rpx;
			font-weight: 400;
			font-size: 22rpx;
			color: #FFFFFF;
			transform: skew(-8deg);
		}
	}
	.introduce {
		padding: 28rpx 0;
		border-top: 1px solid #eee;
		.introduce_item {
			margin-right: 48rpx;
			image {
				width: 32rpx;
				height: 32rpx;
				margin-right: 10rpx;
			}
		}
	}
	.condition {
		background: #f6f7fb;
		border-radius: 16rpx;
		padding: 20rpx 14rpx;
		margin-bottom: 28rpx;
		.condition_title {
			margin-bottom: 10rpx;
			.condition_title_le {
				font-weight: 500;
				font-size: 26rpx;
				color: #111111;
				image {
					width: 32rpx;
					height: 32rpx;
					margin-right: 8rpx;
				}
			}
			.condition_title_ri {
				
			}
		}
		.condition_item {
			margin-top: 24rpx;
			.condition_item_le {
				font-weight: 400;
				font-size: 26rpx;
				color: #999999;
			}
			.condition_item_ri {
				font-weight: 500;
				font-size: 28rpx;
				color: #111111;
				image {
					width: 20rpx;
					height: 20rpx;
					margin-left: 8rpx;
				}
			}
		}
	}
	.tip_text {
		font-weight: 400;
		font-size: 22rpx;
		color: #999999;
		margin-bottom: 24rpx;
		image {
			width: 28rpx;
			height: 28rpx;
			margin-right: 6rpx;
		}
	}
	.prompt_text {
		font-weight: 400;
		font-size: 22rpx;
		color: #999999;
		margin-top: 34rpx;
		padding-bottom: 24rpx;
	}
	.range_info {
		font-weight: bold;
		font-size: 30rpx;
		color: rgba(0,0,0,0.8);
		padding: 28rpx 0;
		image {
			width: 28rpx;
			height: 28rpx;
		}
	}
	.save_button {
		width: 100%;
		position: fixed;
		bottom: 0rpx;
		left: 0rpx;
		padding: 6rpx 24rpx 12rpx;
		background: #fff;
		z-index: 10;
	
		.save_text {
			width: 702rpx;
			height: 96rpx;
			line-height: 96rpx;
			text-align: center;
			background: #1A66FA;
			color: #ffffff;
			font-size: 30rpx;
			font-weight: 500;
			border-radius: 16rpx;
		}
	}

	.pad24 {
		padding: 0 24rpx;
	}
	
	
	
	.car_price_list {
		padding: 0 24rpx 24rpx;
		.car_price_item {
			margin-top: 16rpx;
			background: #fff;
			border-radius: 16rpx;
			padding-bottom: 32rpx;
			.car_price_top {
				padding-left: 24rpx;
				.top_price_le {
					width: calc(100% - 200rpx);
					.card_price_no {
						.card_price_no_text {
							font-weight: bold;
							font-size: 36rpx;
							color: #222222;
						}
					}
				}
				.top_price_ri {
					width: 200rpx;
					height: 106rpx;
					.car_price_img {
						width: 200rpx;
						height: 106rpx;
					}
				}
			}
			// .car_ce {
			// 	margin: 8rpx 24rpx 0;
			// 	background: #F6F7FB;
			// 	border-radius: 16rpx;
			// 	padding: 20rpx 24rpx;
			// 	font-weight: 400;
			// 	font-size: 28rpx;
			// 	color: #222222;
			// }
			.car_price_date {
				padding: 0 24rpx;
			}
			.date_item {
				.date_item_1 {
					font-weight: 400;
					font-size: 24rpx;
					color: #666666;
				}
				.date_item_2 {
					margin-top: 12rpx;
					font-weight: bold;
					font-size: 32rpx;
					color: #111111;
				}
			}
			.date_ce {
				text-align: center;
				.date_ce_1 {
					width: 192rpx;
					height: 10rpx;
					background: rgba(0, 0, 0, 0.05);
				}
				.date_ce_2 {
					font-weight: bold;
					font-size: 24rpx;
					color: #111111;
					margin-top: 22rpx;
				}
			}
			.car_price_btm {
				margin: 20rpx 24rpx 0;
				.btm_price_le {
					.p_btm_le_item {
						border-radius: 16rpx;
						border: 2rpx solid #DFE9FF;
						.p_btm_le_item_week {
							font-weight: 500;
							font-size: 24rpx;
							color: #1A66FA;
							width: 90rpx;
							height: 56rpx;
							background: #DFE9FF;
							border-radius: 16rpx 0 30rpx 16rpx;
						}
						.p_btm_le_item_price {
							color: #1A66FA;
							font-weight: 500;
							font-size: 24rpx;
							padding: 0 14rpx;
							
						}
						.p_btm_le_item_week_ot {
							font-weight: 500;
							font-size: 24rpx;
							color: #FF532E;
							width: 210rpx;
							height: 56rpx;
							background: #FFEBE7;
							border-radius: 16rpx 0 30rpx 16rpx;
						}
						.p_btm_le_item_price_ot {
							color: #FF532E;
							font-weight: 500;
							font-size: 24rpx;
							padding: 0 14rpx;
						}
					}
				}
			}
			.operation_view {
				margin: 26rpx 24rpx 0;
				.operation_1 {
					width: 208rpx;
					height: 80rpx;
					border-radius: 16rpx;
					border: 2rpx solid #EEEEEE;
					font-weight: 400;
					font-size: 28rpx;
					color: #222222;
					image {
						width: 32rpx;
						height: 32rpx;
						margin-right: 10rpx;
					}
				}
				.operation_2 {
					font-weight: bold;
					font-size: 30rpx;
					color: #222222;
				}
			}
		}
	}
	
	
	.deductible_popup {
		width: 626rpx;
		position: relative;
		.pop_title {
			text-align: center;
			font-weight: 800;
			font-size: 36rpx;
			color: #222222;
			padding: 40rpx 0 12rpx;
		}
		.pop_tips {
			padding: 0 38rpx;
			margin-top: 16rpx;
			.tips_le {
				width: 8rpx;
				height: 8rpx;
				border-radius: 50%;
				background: #1A66FA;
				margin-right: 16rpx;
				transform: translateY(16rpx);
			}
			.tips_ri {
				width: calc(100% - 24rpx);
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				line-height: 36rpx;
			}
		}
		.pop_btn {
			width: 548rpx;
			height: 88rpx;
			background: #1A66FA;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 32rpx;
			color: #FFFFFF;
			margin: 66rpx auto 52rpx;
		}
		.pop_bg {
			width: 100%;
			height: 220rpx;
			background: linear-gradient( 180deg, rgba(26,102,250,0.2) 0%, rgba(255,255,255,0) 100%);
			border-radius: 32rpx 32rpx 0px 0px;
			position: absolute;
			top: 0;
			left: 0;
		}
		.title_text {
			padding: 36rpx 40rpx 22rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #000000;
		}
		.input_view {
			width: 548rpx;
			height: 88rpx;
			border-radius: 16rpx;
			border: 2rpx solid #1A66FA;
			padding: 24rpx 0rpx;
			margin: 0 40rpx;
			.input {
				padding: 0 30rpx;
			}
			.money_icon {
				font-weight: bold;
				font-size: 32rpx;
				color: #1A66FA;
				margin-left: 30rpx;
			}
		}
		.operation {
			margin: 46rpx 0;
			padding: 0 40rpx;
			.operation_1 {
				width: 266rpx;
				height: 88rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #222222;
			}
			.operation_2 {
				width: 266rpx;
				height: 88rpx;
				background: #1A66FA;
				border-radius: 16rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #fff;
			}
		}
		
		.charge_list {
			overflow: hidden;
			padding: 10rpx 40rpx 0;
			.charge_item {
				float: left;
				width: 174rpx;
				height: 80rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				margin-bottom: 10rpx;
				margin-right: 10rpx;
				image {
					width: 24rpx;
					height: 24rpx;
					margin-right: 4rpx;
				}
			}
			.active_item {
				color: #1A66FA;
				background: #F1F6FF;
				border: 2rpx solid #AAC7FF;
			}
			.charge_item:nth-child(3n+3) {
				margin-right: 0;
			}
		}
	}
	
	.screen_popup {
		.screen_title {
			padding: 30rpx 30rpx 30rpx 30rpx;
			font-weight: bold;
			font-size: 36rpx;
			color: #222222;
			border-bottom: 1px solid #eee;
		}
		.second_title {
			padding: 0 30rpx;
			margin: 32rpx 0 24rpx;
			font-weight: 500;
			font-size: 32rpx;
			color: #000000;
		}
		.screen_list {
			overflow: hidden;
			padding: 0 30rpx;
			.screen_item {
				float: left;
				margin-right: 12rpx;
				margin-bottom: 12rpx;
				width: 164rpx;
				height: 80rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				border: 2rpx solid #F6F7FB;
			}
			.active_item {
				background: #F1F6FF;
				border: 2rpx solid #AAC7FF;
				color: #1A66FA;
			}
			.screen_item:nth-child(4n+4) {
				margin-right: 0;
			}
		}
		.float_type {
			overflow: hidden;
			padding: 0 30rpx;
			.float_item {
				float: left;
				margin-right: 26rpx;
				margin-bottom: 12rpx;
				width: 332rpx;
				height: 80rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				border: 2rpx solid #F6F7FB;
			}
			.active_item {
				background: #F1F6FF;
				border: 2rpx solid #AAC7FF;
				color: #1A66FA;
			}
			.float_item:nth-child(2n+2) {
				margin-right: 0;
			}
		}
		.input_price {
			width: 690rpx;
			height: 88rpx;
			border-radius: 16rpx;
			border: 2rpx solid #1A66FA;
			padding: 24rpx 0rpx;
			margin: 0 30rpx;
			.input {
				padding: 0 16rpx;
			}
			.money_icon {
				font-weight: bold;
				font-size: 32rpx;
				color: #1A66FA;
				margin-left: 30rpx;
			}
		}
		.screen_date {
			width: 692rpx;
			height: 80rpx;
			border-radius: 16rpx;
			border: 2rpx solid #EEEEEE;
			margin: 0 30rpx;
			padding-left: 46rpx;
			.date_icon {
				width: 40rpx;
				height: 40rpx;
			}
			.date_content {
				margin-left: 54rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #666666;
				.date_content_line {
					margin: 0 86rpx;
				}
			}
		}
		.picker_btn {
			background: #fff;
			padding: 12rpx 30rpx 28rpx;
			margin-top: 12rpx;
			border-top: 1px solid #eee;
		}
		.picker_btn_1 {
			width: 236rpx;
			height: 96rpx;
			background: #F6F7FB;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #222222;
		}
		.picker_btn_2 {
			width: 436rpx;
			height: 96rpx;
			background: #1A66FA;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #fff;
		}
		.feedback_fd2_1 {
			background: #f6f7fb;
			border-radius: 8rpx;
			margin: 30rpx 30rpx 0;
			font-size: 26rpx;
			position: relative;
		}
		.feedback_input_fd2_1 {
			padding: 32rpx 34rpx 60rpx 34rpx;
			width: 100%;
			height: 290rpx;
			font-weight: 400;
			font-size: 30rpx;
			color: #222;
		}
		.feedback_num {
			font-weight: 500;
			font-size: 26rpx;
			color: rgba(23,19,19,0.4);
			position: absolute;
			right: 20rpx;
			bottom: 20rpx;
		}
	}
	
	.personalInformation_picker2_0 {
		border-bottom: 1px solid #eee;
		background: #fff;
		background-size: 100% !important;
		padding: 0rpx 32rpx 0rpx 32rpx;
		border-radius: 16rpx 16rpx 0rpx 0rpx;
		background-size: 100% auto !important;
		height: 100rpx;
	}

	.personalInformation_picker2_0_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #BFBFBF;
	}

	.personalInformation_picker2_0_c1 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 500;
		color: #333333;
	}

	.personalInformation_picker2_0_c2 {
		color: rgba(44, 143, 255, 1);
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
	}

	.personalInformation_fd1_0 {
		// margin-top: 32rpx;
		height: 96rpx;
		border-top: 1px solid #eee;
	}

	.personalInformation_fd1_0_c0 {
		font-weight: 400;
		font-size: 28rpx;
		color: rgba(0,0,0,0.6);
	}

	.personalInformation_fd1_0_c1_image {
		width: 72rpx;
		height: 72rpx;
		border-radius: 50%;
	}

	.personalInformation_fd1_1 {
		border-bottom: 1px solid #eee;
		height: 109rpx;
	}

	.personalInformation_fd1_1_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #333333;
	}

	.personalInformation_fd1_1_c1 {
		font-weight: 400;
		font-size: 28rpx;
		color: #222222;
		text-align: right;
		margin: 0rpx 0rpx 0rpx 24rpx;
	}

	.personalInformation_fd1_2 {
		border-bottom: 1px solid #eee;
		height: 109rpx;
	}

	.personalInformation_fd1_2_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #333333;
	}

	.personalInformation_fd1_2_c1 {
		font-size: 32rpx;
		font-weight: 400;
		color: #333;
		text-align: right;
		margin: 0rpx 0rpx 0rpx 24rpx;
	}

	.personalInformation_fd1_3 {
		border-bottom: 1px solid #eee;
		height: 109rpx;
	}

	.personalInformation_fd1_3_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #333333;
	}

	.personalInformation_fd1_3_c1 {
		font-weight: 500;
		font-size: 28rpx;
		color: rgba(0,0,0,0.8);
	}

	.personalInformation_flex_1 {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 24rpx 0rpx 24rpx;
		margin: 16rpx 24rpx 0;
	}

	.personalInformation_fd0_0 {
		padding: 0rpx 32rpx 0rpx 32rpx;
		height: 88rpx;
	}

	.personalInformation_fd0_0_c0_c0 {
		font-size: 32rpx;
		font-weight: 500;
		color: #111;
	}

	.personalInformation_fd0_0_c1 {
		font-size: 32rpx;
		font-weight: bold;
		color: #111111;
	}

	.personalInformation_fd0_0_c2 {
		width: 36rpx;
		height: 36rpx;
	}

	.personalInformation_flex_0 {
		width: 750rpx;
		height: 88rpx;
		overflow: hidden;
		z-index: 10;
		top: 0rpx;
		background: url(https://speed.zhongchuxing.com/gjdimages/page_bg.png) no-repeat;
		background-size: 100% auto !important;
	}

	.page {
		min-height: calc(100vh - var(--window-bottom));
		background: url(https://speed.zhongchuxing.com/gjdimages/page_bg.png) no-repeat #F6F7FB;
		background-size: 100% auto !important;
	}
</style>